<!--  -->
<template>
    <div class="box1">
        <tou-bu-one :ct="ct" @ctchange1="ctchange"></tou-bu-one>
        <div v-if="this.$route.path === '/content/movies/hot'">
            <banner></banner>
            <movie></movie>
        </div>
        <div v-else-if="this.$route.path === '/content/movies/wait'">
            <banner-wait></banner-wait>
            <movie-wait></movie-wait>
        </div>
    </div>
</template>

<script>
    import TouBuOne from '@/components/TouBuOne.vue'
    import Movie from '@/components/Movie.vue'
    import MovieWait from '@/components/MovieWait.vue'
    import Banner from "@/components/banner.vue"
    import BannerWait from "@/components/bannerWait.vue"
    import {
        baseURL
    } from "@/utils/httpRequest.js"
    import {
        mapState
    } from "vuex"
    export default {
        data() {
            return {};
        },

        components: {
            TouBuOne,
            Banner,
            Movie,
            BannerWait,
            MovieWait
        },

        mounted() {

        },

        methods: {
            ctchange() {
                this.$router.push("/diqu")
            }
        },
        computed: {
            ...mapState("ct", ["ct"]),
        }
    }
</script>
<style lang="scss" scoped>
    @import '@/assets/scss/variable.scss';
    @import '@/assets/scss/mixin.scss';

    .box1 {
        flex: 1;
        overflow: auto;
        background-color: #fff;
    }

    div {
        height: 100%;
        display: flex;
        flex-direction: column;

        // >div {
        //     height: 0.44rem;
        //     background-color: $primary-color;
        //     line-height: 0.44rem;
        //     font-size: 0.2rem;
        //     color: #fff;
        //     text-align: center;
        // }
    }
</style>